import Vue from 'vue';
import Router from 'vue-router';

Vue.use(Router);

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
        {
            path: '/',
            name: '/',
            redirect: '/index',
        },
        {
            path: '/about',
            name: 'about',
            // route level code-splitting
            // this generates a separate chunk (about.[hash].js) for this route
            // which is lazy-loaded when the route is visited.
            component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/About.vue'),
        },
        {
            path: '/index',
            name: 'index',
            meta: {
                title: '首页',
                subTitle: '',
            },
            component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/Index.vue'),
        },
        // 组件示例
        ...[
            {
                path: '/component/index',
                name: 'component-index',
                meta: {
                    title: '组件',
                    subTitle: '列表',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Index.vue'),
            },
            {
                path: '/component/form',
                name: 'component-form',
                meta: {
                    title: '表单',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Form.vue'),
            },
            {
                path: '/component/badge',
                name: 'component-badge',
                meta: {
                    title: '徽章',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Badge.vue'),
            },
            {
                path: '/component/cell',
                name: 'component-cell',
                meta: {
                    title: '列表',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Cell.vue'),
            },
            {
                path: '/component/button',
                name: 'component-button',
                meta: {
                    title: '按钮',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Button.vue'),
            },
            {
                path: '/component/divider',
                name: 'component-divider',
                meta: {
                    title: '分割线',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Divider.vue'),
            },
            {
                path: '/component/grid',
                name: 'component-grid',
                meta: {
                    title: '九宫格',
                    subTitle: '示例',
                },
                component: () => import(/* webpackChunkName: "componentDemo" */ '@/pages/component/Grid.vue'),
            },
        ],
    ],
});
